<template>
    <div class="cell-item">
        <LabelRow v-on:onMore="onMore" v-bind:label="label" text="更多>>"></LabelRow>
        <ul class="cell-ul">
            <li v-for="(item,index) in dataList" :key="index" class="jj-li">
                <!-- <div class="jj-label">

                </div> -->
                <div class="cell-label jj-label">
                    <div class="text-over">
                        <img @click = "searchExpress" class = "pointer" src="../../assets/unifyAcceptWorkbench/wdjj-label-icon.png" alt="">
                        <span :slot-scope = "item.expressNo">{{item.expressNo}}</span>
                    </div>
                </div>
                <div class="jj-status">
                    <span class="jj-time">{{getTimeStr(item.createTime)}}</span>
                    <span>已邮寄</span>
                </div>
            </li>
            <div v-if="!dataList.length" class="no-data">
                <img src="../../assets/no-data.png" alt="">
            </div>
        </ul>
        <JJDialog/>
    </div>
</template>
<script>
import LabelRow from "../common/labelRow.vue";
import { myExpress } from "../../config/api";
import { getTimeStr } from "../../utils";
import Pubsub from "../../utils/pubsub";
import JJDialog from "./jjDialog.vue";

export default {
    components: {
        LabelRow,
        JJDialog,
    },
    data() {
        return {
            label: {
                url: require("../../assets/unifyAcceptWorkbench/wdjj-icon.png"),
                label: "我的寄件"
            },
            dataList: [],
            getTimeStr
        };
    },
    mounted() {
        this.getList();
    },
    methods: {
        searchExpress(){
            window.open(" https://www.baidu.com/s?ie=utf-8&f=3&rsv_bp=1&rsv_idx=1&tn=baidu&wd=%E9%82%AE%E6%94%BF%E5%BF%AB%E9%80%92%E5%8D%95%E5%8F%B7%E6%9F%A5%E8%AF%A2&rsv_pq=f27adb0600001343&rsv_t=0ad3rdCQmu6EjYfz0OWZJqd3GY9iNLL7%2BN717wFUQD4Y4dHhpol03s9TjLk&rqlang=cn&rsv_enter=1&rsv_sug3=9&rsv_sug1=5&rsv_sug7=100&rsv_sug2=0&prefixsug=%25E9%2582%25AE%25E6%2594%25BF&rsp=0&inputT=2390&rsv_sug4=2390","_blank")
        },
        getList() {
            myExpress({ pageNum: 1, pageSize: 5 }).then((result = {}) => {
                let data = result.data || {};
                let rows = data.rows || [];
                this.dataList = rows;
            });
        },
        onMore() {
             Pubsub.publish("showjjDialog");
        }
    }
};
</script>

<style lang="scss" scoped>
@import "../../css/unifyAcceptWorkbench.scss";
.jj-li {
    display: flex;
    justify-content: space-between;
    padding: 15px 0 10px 0;
    border-bottom: 1px solid #c9c9c9;
    &:first-child {
        padding-top: 0;
    }
}
.jj-label {
    font-size: 16px;
    img {
        margin-right: 15px;
        display: inline-block;
    }
}
.jj-status {
    color: #00a01e;

    // font-size: 18px;
}
.jj-time {
    color: #999;
    margin-right: 5px;
}
</style>
